<?php require VIEWPATH. ADMIN_DIR. DIRECTORY_SEPARATOR. 'header.php'?>
<!-- 引入toastr.css -->
<link rel="stylesheet" href="<?=$staticAdminUrl?>assets/toastr/toastr.min.css">
	<div class="page-header">
		<h1><?=isset($videoInfo) ? '编辑班级视频' : '发布班级视频'?></h1>
	</div>
	<div class="col-xs-12">
		<form class="form-horizontal" id="classes-form">
			<input type="hidden" name="id" value="<?= isset($videoInfo['id']) ? $videoInfo['id'] : 0 ?>" />
			<input type="hidden" name="video_link" value="<?= isset($videoInfo['video_link']) ? $videoInfo['video_link'] : '' ?>" />
			<input type="hidden" name="video_poster" value="<?= isset($videoInfo['video_poster']) ? $videoInfo['video_poster'] : '' ?>" />
			<div class="form-group">
				<label class="col-sm-3 control-label no-padding-right">视频标题：</label>
				<div class="col-sm-6">
					<input class="form-control" type="text" name="video_title" value="<?= isset($videoInfo['video_title']) ? $videoInfo['video_title'] : '' ?>" placeholder="请填写视频标题"/>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label no-padding-right">视频文件：</label>
				<div class="col-sm-6">
					<div id="video-wrap" style="display: inline-block;"></div>
					<a href="javascript:;" id="upload-video" title="上传视频">
						<img class="fit-cover" src="<?=$staticAdminUrl?>assets/images/upload.png" width="160" height="160" />
					</a>
				</div>
			</div>
			<!-- <div class="form-group">
				<label class="col-sm-3 control-label no-padding-right">在上课模式播放：<br>（开启后，播放视频时，班牌不会自动跳转到上课模式）</label>
				<div class="col-sm-6">
					<select class="form-control" name="play_in_class_mode">
						<option value="0">否</option>
						<option value="1" style="color: red">是</option>
					</select>
				</div>
			</div> -->
			<div class="form-group">
				<label class="col-sm-3 control-label no-padding-right">发布班级：</label>
				<div class="col-sm-6">
					<?php foreach($gradeArray as $key => $grade): ?>
						<div class="well well-sm">
							<a class="blue select-grade" href="javascript:;" title="全选年级"><?=$key?> <span style="color: #999;margin-left: 5px">(点击选中全部班级)</span></a>
							<div class="mt5">
							<?php foreach($grade['class'] as $class): ?>
								<label class="inline checkbox-item mr20">
									<input class="ace" type="checkbox" name="video_class" value="<?=$class['id']?>" />
									<span class="lbl"> <?=$class['class_name']?></span>
								</label>
							<?php endforeach; ?>
							</div>
						</div>
					<?php endforeach; ?>
				</div>
			</div>
			<div class="clearfix">
				<div class="col-md-offset-3 col-md-9">
					<button class="btn btn-info" type="submit">
						<i class="ace-icon fa fa-check"></i> 提交
					</button>
				</div>
			</div>
		</form>
	</div>
<?php require VIEWPATH. ADMIN_DIR. DIRECTORY_SEPARATOR. 'footer.php'?>
<!-- 引入toastr.js,基于jquery.js，故得在footer.php后面引用-->
<script src="<?=$staticAdminUrl?>/assets/toastr/toastr.min.js"></script>
<script type="text/javascript">
	$(function(){
		<?php if(isset($videoInfo)): ?>
			// 选中接收的班级
			var classArray = "<?=$videoInfo['class_id']?>".split(",");
			for(var i in classArray) $("[name=video_class][value="+ classArray[i] +"]")[0].checked = true;
		<?php endif; ?>

		// 点击年级，全选下级班级
		var cancel = false;
		$(".select-grade").click(function(){
			// 第一选择，第二次取消选择
			if(cancel) {
				// 取消选择
				$(this).parent().find("[name=video_class]").each(function(){
					$(this)[0].checked = false;
				});
				cancel = ! cancel;
			} else {
				// 选择
				$(this).parent().find("[name=video_class]").each(function(){
					$(this)[0].checked = true;
				});
				cancel = ! cancel;
			}
		})

		// 视频上传
		$("#upload-video").uploader({
			"server":  '<?=UP_FORM_URL?>',
			"accept": "video",
			"callback": function(response) {
				// console.log(response);
				var fileLink =  response.url;
				// 视频截取封面
				var url = '<?= wx_url("util/video_snapshot") ?>';
				var params = { video_link: fileLink};
				ajax_get(url, params, function(res) {
					var videoCover = res.data.video_cover;
					// 加载视频文件
					append_video(fileLink, videoCover);

				});
			}
		});

		// 提交表单
		var form = $("#classes-form");
		var submitUrl = "<?=admin_url('contents/save_video_action')?>";
		form_submit(form, submitUrl, function(res) {
			tips_alert(res.msg, res.success, function(){
				if(res.success) {
					window.location.href = "<?=admin_url('contents/video')?>";
				}
			});
		})

		// 动态加载视频封面
		setInterval(function(){
			$("video").each(function(){
				var poster = $(this).attr("poster");
				var videoFile = $(this).attr("src");
				// var videoPoster = videoFile.replace(".mp4", "<?=UP_VIDEO_COVER?>");

				// if(!poster && check_img_exists(videoPoster)) append_video(videoFile, videoPoster);
			})
		}, 1000)

		// 如果是修改操作
		<?php if(isset($videoInfo) && $videoInfo['video_link']): ?>
			append_video("<?=$videoInfo['video_link']?>", "<?=$videoInfo['video_poster']?>");

			// 在上课模式播放
			// $("[name=play_in_class_mode]").val("<?=$videoInfo['play_in_class_mode']?>");
		<?php endif; ?>
	})

	// 显示视频文件
	function append_video(src, poster){
		$("#video-wrap").html('<video src="'+ src + '" poster="'+ poster +'" controls="" style="max-width:320px;margin-right:10px"></video>');
		$("[name=video_link]").val(src);
		$("[name=video_poster]").val(poster);
	}
</script>